
<%-- 
  - Author: Asna
  - Date: 10-May-2012
  - Copyright Notice: TRAKHEES
  - Description: form.jsp
 --%>

<%@ include file="/WEB-INF/view/include.jsp"%>

<div class="t_tmiddle-right">
	<div id="tabs">
		<ul id="TabHeader">
			<li><a href="#MainDetails"><spring:message
						code="noc.and.letters.noc.header" /></a></li>
    	
		</ul>	
		
		<form:form modelAttribute="nocAndLettersModel" name="nocAndLettersFrm"
			id="nocAndLettersFrm" method="POST" enctype="multipart/form-data"
			class="t_form">
			<spring:hasBindErrors name="nocAndLettersModel">
				<script type="text/javascript">
					$(document)
							.ready(
									function() {
										jAlert(
												'error',
												'<li><form:errors path="*" delimiter="<li>"/>',
												'<spring:message code="label.errormessage" />');
									});
				</script>
			</spring:hasBindErrors>
			
		    <table  style="width: 100%">
		    	<tr height="5px;"><td colspan="3"></td></tr>
		    	<tr><td width="20%"></td><td align="center"><div class="t_gin-grey-txt"><spring:message code="label.wfstatus" />${nocAndLettersModel.wfStatus}</div></td><td width="20%"></td></tr>
		    </table>

			<%@include file="MainTab.jsp"%>
			
		
        	 
          	<div id="backgroundPopup"></div>
		</form:form>
	</div>
</div>
<!--Middle Right Close-->
<script>

	var $tabs;	
	var submAction = null;
	
	//Validation - Required fields
	$().ready(
					function() {

						$(".topnav")
								.accordion(
										{
											accordion : false,
											speed : 500,
											closedSign : '<img src=\'resources/images/common/close.jpg\' />',
											openedSign : '<img src=\'resources/images/common/open.jpg\' />'
										});
						
						$("#nocAndLettersFrm")
								.validate(
										{

											onfocusout : false,
											onkeyup : false,
											onclick : false,
											rules : {
												employeeId : "required",
												textFormat : "required",
												nocAndLetters : "required",
												signature : "required",
												
												fnpServiceCode : {
													required : {
														depends: function(element) {
												           return submAction == "submit";
												        }
													}
												},
												
												adminComments : {
													required : {
														depends: function(element) {
												           return submAction == "reject";
												        }
													}
												}
												
											},
											
											submitHandler: function (form) {
												blockPage();
												form.submit();
											},

											showErrors : function(errorMap,
													errorList) {

												var errors = '<ul>';
												var label;
												if (errorList.length) {
													$.each(errorMap, function(
															name, value) {
														label = $(
																"label[for='"
																		+ name
																		+ "']")
																.html();
														label = value + '['
																+ label + ']';
														errors = errors
																+ '<li>'
																+ label
																+ '</li>';

													});
													errors = errors + '</ul>';
													jAlert('error', errors,
															'<spring:message code="label.errormessage" />');
													return false;
												}
											}
										});// end $("#EmploymentVisaFrm").validate

						$tabs = $("#tabs").tabs();
										
						$('#TabHeader')
								.removeClass(
										'ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all');
						
						$('#TabHeader > li')
								.removeClass(
										'ui-state-default ui-corner-top ui-state-active ui-state-hover');
						
						$('#tabs').removeClass(
								'ui-widget ui-widget-content ui-corner-all');
						
						$('#tabs').tabs(
								{
									select : function(event, ui) {

										var selected = $tabs.tabs('option',
												'selected'); // => 0
										var clicked = ui.index; // => 0

										if (selected > clicked)
											return true;

										var isValid = validate();// form validation returning true or false

										return isValid;
									}
								});
						
						$('#Main-Next').click(function() {
							$tabs.tabs('select', 1);
							return false;
						});
						
						$('#Summary-Previous').click(function() {
							$tabs.tabs('select', 0);
							return false;
						});

						$('#strPostNo').val('Auto Generated');

						//CLOSING POPUP
						//Click the x event!
						$("#popupContactClose").click(function() {
							disablePopup();
						});
						//Click out event!
						$("#backgroundPopup").click(function() {
							disablePopup();
						});
						//Press Escape event!
						$(document).keypress(function(e) {
							if (e.keyCode == 27 && popupStatus == 1) {
								disablePopup();
							}
						});
					});
	
	function setAction(inaction){
		submAction = inaction;
		
		if(inaction =='cancel'){
			
			fancyConfirm('<spring:message code="message.cancel_confirmation_message" />'
					,'<spring:message code="button.No" />'
					,'<spring:message code="button.yes" />'
					, function(ret) {
						if(ret == true){
							//cancel
							var input = $("<input>").attr("type", "hidden").attr("name", "MainUserCancel").val("MainUserCancel");
							$('#nocAndLettersFrm').append($(input));
							$('#nocAndLettersFrm').submit();
							$.fancybox.showLoading();
						}
			});
		}
	}
	
	function validate() {
		return ($("#nocAndLettersFrm").validate().element("#fnpServiceCode"));		
	}
	
	function handler() {
		$.fancybox.close();
	}

	function submitForm(divId){
		$('#nocAndLettersFrm').append($("#"+divId).html());
		var input = $("<input>").attr("type", "hidden").attr("name", "MainUserApprove").val("MainUserApprove");
		$('#nocAndLettersFrm').append($(input));
		$.fancybox.showLoading();
		$('#nocAndLettersFrm').submit();
	}
	
	jQuery(document).ready(
			function() {
				EmployeeAutoFiller.init("employeeId");
				
				EmployeeAutoFiller.defineFieldMapping("empNameEn","employeeNameEng");
				EmployeeAutoFiller.defineFieldMapping("empNameAr","employeeNameArab");
				EmployeeAutoFiller.defineFieldMapping("empNationality","employeeNationality");
				
				EmployeeAutoFiller.defineFieldMapping("empCECNo","employeeCecNumber");
								
				EmployeeAutoFiller.fillFields();
			});
</script>

